<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>按月统计分析</title>
	<link rel="stylesheet" type="text/css" href="/static/insdep/insdep.easyui.min.css"></link>
	<link rel="stylesheet" type="text/css" href="/static/insdep/icon.css"></link>
	<link rel="stylesheet" type="text/css" href="/static/insdep/custom.css"></link>
	<link rel="stylesheet" type="text/css" href="https://www.huangwx.cn/css/sweetalert.css">
	<script type="text/javascript" src="https://www.huangwx.cn/js/sweetalert-dev.js"></script>
	<script type="text/javascript" src="/static/jquery-easyui-1.5/jquery.min.js"></script>
	<script type="text/javascript" src="/static/jquery-easyui-1.5/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="/static/jquery-easyui-1.5/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript" src="/static/highcharts4/js/highcharts.js"></script>
	<script type="text/javascript" src="/static/js/date.js"></script>
	<script type="text/javascript">
		// 页面加载完成后执行的函数，用于初始化页面元素和加载数据
		$(document).ready(function () {
			// 获取当前日期并格式化为'年-月'形式，作为结束日期的默认值
			var defaultEndDate = getDefaultEndDate();
			// 设置开始日期框的默认值为2023年（你期望的初始开始日期，这里调整为带月份的格式示例，取当前年份的1月）
			var defaultStartDate = defaultEndDate.slice(0, 4) + "-01";
			// 初始化开始月份的日期选择框
			initDate("#s_begin", defaultStartDate);
			// 初始化结束月份的日期选择框，传入处理后的默认结束日期值
			initDate("#s_end", defaultEndDate);
			// 调用search函数来获取并展示数据，传入初始的开始和结束日期值
			search(defaultStartDate, defaultEndDate);
		});

		// 获取默认结束日期的函数，改进了日期获取及处理逻辑，确保能正确得到默认结束日期值
		function getDefaultEndDate() {
			var today = new Date();
			var y = today.getFullYear();
			var m = today.getMonth() + 1;
			return y + '-' + (m < 10? ('0' + m) : m);
		}

		// 初始化日期选择框的函数，接收选择器和默认值作为参数，修改onChange事件里的弹窗提示逻辑
		function initDate(dateboxId, defaultValue) {
			// 配置日期选择框的各种属性
			var dateboxConfig = {
				value: defaultValue,
				formatter: myformatter,
				parser: myparser,
				editable: false
			};
			// 应用配置来初始化日期选择框
			$(dateboxId).datebox(dateboxConfig);
			// 定义一个变量来标记是否已经弹出过提示框，避免重复弹窗
			var hasAlerted = false;

			// 为日期选择框的日历组件绑定onChange事件，用于验证选择的月份是否符合要求，添加更严格的日期范围验证逻辑及分别提示弹窗信息
			$(dateboxId).datebox('calendar').calendar({
				onChange: function (date) {
					var startDate = $("#s_begin").datebox("getValue");
					var endDate = $("#s_end").datebox("getValue");

					// 分别判断开始月份和结束月份不符合要求的情况，并给出对应弹窗提示
					var startInvalid = false;
					var endInvalid = false;

					// 判断开始月份是否晚于结束月份
					if (compareDates(startDate, endDate) > 0) {
						startInvalid = true;
					}

					// 判断结束月份是否超过当前月份
					if (compareDates(endDate, getDefaultEndDate()) > 0) {
						endInvalid = true;
					}

					if (startInvalid && endInvalid &&!hasAlerted) {
						alert("选择的日期范围不符合要求，请重新选择！规则：开始月份<=截至月份，截至月份<=当前月，当前开始月份晚于截至月份且截至月份超过当前月");
						// 设置标记为已弹出提示框
						hasAlerted = true;
					} else if (startInvalid &&!hasAlerted) {
						alert("开始月份不能晚于结束月份，请重新选择！");
						// 设置标记为已弹出提示框
						hasAlerted = true;
					} else if (endInvalid &&!hasAlerted) {
						alert("结束月份不能超过当前月份，请重新选择！");
						// 设置标记为已弹出提示框
						hasAlerted = true;
					}

					// 如果不符合要求（只要有一端不符合就算不符合要求），恢复原来设置的默认值
					if (startInvalid || endInvalid) {
						$(dateboxId).datebox("setValue", defaultValue);
						return;
					}

					// 如果当前选择符合要求，重置标记变量，以便下次验证
					hasAlerted = false;
				}
			});
		}

		// 验证日期范围是否有效的函数，严格判断开始时间小于等于截止时间，且截止时间小于等于当前日期所在月
		function isValidDateRange(startDate, endDate) {
			var currentMonth = getDefaultEndDate();
			var start = myparser(startDate);
			var end = myparser(endDate);
			if (start && end) {
				var startYear = start.getFullYear();
				var startMonth = start.getMonth() + 1;
				var endYear = end.getFullYear();
				var endMonth = end.getMonth() + 1;

				// 判断开始时间小于等于截止时间，且截止时间小于等于当前日期所在月
				return (startYear < endYear || (startYear === endYear && startMonth <= endMonth))
						&& (endYear < getCurrentYear() || (endYear === getCurrentYear() && endMonth <= getCurrentMonth()));
			}
			return false;
		}

		// 获取当前年份的函数
		function getCurrentYear() {
			return new Date().getFullYear();
		}

		// 获取当前月份的函数
		function getCurrentMonth() {
			return new Date().getMonth() + 1;
		}

		// 比较两个日期（这里实际是年月格式的字符串）先后顺序的函数，用于验证月份选择的合理性
		function compareDates(date1, date2) {
			var d1 = myparser(date1);
			var d2 = myparser(date2);
			if (d1 && d2) {
				return d1.getFullYear() - d2.getFullYear() || d1.getMonth() - d2.getMonth();
			}
			return 0;
		}

		// 用于查询数据并在页面上进行展示的函数，包括图表和表格数据展示，接收开始和结束日期作为参数
		function search(startDate, endDate) {
			// 若结束日期为空，设置为当前年份的最后一个月作为默认结束日期（可根据业务需求调整）
			if (!endDate) {
				endDate = getCurrentYearLastMonth();
			}
			// 清空datagrid表格的数据，准备重新加载新数据
			$('#dg').datagrid('loadData', { total: 0, rows: [] });

			var chart = new Highcharts.Chart({
				chart: {
					renderTo: 'container',
					type: 'column',
					events: {
						load: function (event) {
							// 使用传入的开始和结束日期参数发送AJAX请求到后台获取按月统计的数据
							$.post("/admin/saleList/countSaleByMonth", { begin: startDate, end: endDate }, function (response) {
								if (response && response.rows) {
									var rows = response.rows;
									var xArr = [];
									var yArr = [];
									for (var i = 0; i < rows.length; i++) {
										xArr.push(rows[i].date);
										yArr.push(rows[i].amountProfit);
										chart.xAxis[0].categories = xArr;
										chart.series[0].setData(yArr);
									}

									var saleTotal = 0, costTotal = 0, profitTotal = 0;
									for (var i = 0; i < rows.length; i++) {
										var row = rows[i];
										$('#dg').datagrid('appendRow', {
											date: row.date,
											amountSale: row.amountSale,
											amountCost: row.amountCost,
											amountProfit: row.amountProfit
										});
										saleTotal += row.amountSale;
										costTotal += row.amountCost;
										profitTotal += row.amountProfit;
									}
									$('#dg').datagrid('appendRow', {
										date: "合计",
										amountSale: saleTotal,
										amountCost: costTotal,
										amountProfit: profitTotal
									});
								} else {
									console.log("后台返回数据不符合预期");
								}

							}, "json");
						}
					}
				},
				title: {
					text: '按月统计分析'
				},
				xAxis: {
					title: '月份',
					categories: []
				},
				yAxis: {
					title: {
						text: '销售利润'
					}
				},
				series: [{
					name: '销售利润',
					data: []
				}]
			});
		}

		// 获取当前年份最后一个月的函数，格式为'年-月'，用于设置默认结束日期
		function getCurrentYearLastMonth() {
			var today = new Date();
			var y = today.getFullYear();
			return y + '-' + '12';
		}

		// 将日期对象格式化为'年-月'格式字符串的函数，用于在日期选择框中显示
		function myformatter(date) {
			var y = date.getFullYear();
			var m = date.getMonth() + 1;
			return y + '-' + (m < 10? ('0' + m) : m);
		}

		// 将'年-月'格式的字符串解析为日期对象的函数，供日期选择框解析输入内容
		function myparser(s) {
			if (!s) return null;
			var parts = s.split('-');
			if (parts.length === 2) {
				var y = parseInt(parts[0], 10);
				var m = parseInt(parts[1], 10);
				if (!isNaN(y) &&!isNaN(m)) {
					return new Date(y, m - 1, 1);
				}
			}
			return null;
		}

		function formatMoney(val, row) {
			// 将数值格式化为带有两位小数的人民币格式字符串，用于表格中金额数据的显示
			return "￥" + val.toFixed(2);
		}

		// 分析和意见相关函数
		function analyzeMonthlyData(startDate, endDate) {

			$.post("/admin/saleList/countSaleByMonth", { begin: startDate, end: endDate }, function (response) {
				if (response && response.rows && Array.isArray(response.rows)) {
					console.log("传入的参数为：", response);

					var rows = response.rows;

					if (!rows || rows.length === 0) {
						return "没有可用于分析的当月数据";
					}

					// 计算各项基础数据
					var totalSale = 0;
					var totalCost = 0;
					var totalProfit = 0;
					var monthData = {};
					rows.forEach(function (row) {
						var month = row.date;
						totalSale += row.amountSale;
						totalCost += row.amountCost;
						totalProfit += row.amountProfit;
						if (!monthData[month]) {
							monthData[month] = {
								sale: 0,
								cost: 0,
								profit: 0
							};
						}
						monthData[month].sale += row.amountSale;
						monthData[month].cost += row.amountCost;
						monthData[month].profit += row.amountProfit;
					});

					// 分析销售趋势
					var saleTrend = analyzeSaleTrend(monthData);

					// 分析成本波动
					var costFluctuation = analyzeCostFluctuation(monthData);

					// 综合评估利润稳定性
					var profitStability = analyzeProfitStability(monthData);

					var analysis = "当月销售情况综合分析：<br>";
					analysis += "总销售金额：￥" + totalSale.toFixed(2) + "<br>";
					analysis += "总成本金额：￥" + totalCost.toFixed(2) + "<br>";
					analysis += "总利润：￥" + totalProfit.toFixed(2) + "<br>";
					analysis += "销售趋势：" + saleTrend + "<br>";
					analysis += "成本波动：" + costFluctuation + "<br>";
					analysis += "利润稳定性：" + profitStability + "<br>";

					// 根据多方面因素给出综合意见
					var opinion = "";
					if (saleTrend === "上升" && costFluctuation === "稳定" && profitStability === "高") {
						opinion = "当月销售呈现良好态势，销售持续上升，成本控制稳定，利润较为可观且稳定。建议继续保持当前策略，并可适度增加投入以扩大市场份额。";
					} else if (saleTrend === "上升" && costFluctuation === "上升" && profitStability === "中") {
						opinion = "销售虽有上升，但成本也在增加，影响了利润稳定性。需审视成本结构，找出成本上升原因并加以控制，同时继续推动销售增长策略。";
					} else if (saleTrend === "下降" && costFluctuation === "稳定" && profitStability === "低") {
						opinion = "销售出现下滑趋势，而成本相对稳定，这可能是市场需求变化或竞争加剧所致。应深入调研市场，调整产品或营销策略，以扭转销售颓势。";
					} else {
						opinion = "当月销售情况较为复杂，存在多种因素相互影响。建议进一步详细分析各月份数据，精准定位问题点，针对性地制定改进方案。";
					}

					analysis += "<br><br>意见：" + opinion;

					$.messager.alert("分析",analysis);
					// 假设页面上有一个id为analysisResult的元素用于展示分析结果，你可以根据实际情况调整
					/*		$("#analyzeMonthly").html(analysis);*/
				} else {
					console.error("后端返回数据格式不符合要求，期望包含名为'rows'的数组属性");
				}
			}, "json");

		}

		function analyzeSaleTrend(monthData) {
			var months = Object.keys(monthData);
			if (months.length < 2) {
				return "数据不足，无法判断";
			}
			var firstMonthSale = monthData[months[0]].sale;
			var lastMonthSale = monthData[months[months.length - 1]].sale;
			if (lastMonthSale > firstMonthSale) {
				return "上升";
			} else if (lastMonthSale < firstMonthSale) {
				return "下降";
			} else {
				return "平稳";
			}
		}

		function analyzeCostFluctuation(monthData) {
			var costDifferences = [];
			var months = Object.keys(monthData);
			for (var i = 1; i < months.length; i++) {
				var prevMonthCost = monthData[months[i - 1]].cost;
				var currentMonthCost = monthData[months[i]].cost;
				var difference = currentMonthCost - prevMonthCost;
				costDifferences.push(difference);
			}
			var averageDifference = costDifferences.reduce(function (a, b) {
				return a + b;
			}, 0) / costDifferences.length;
			if (Math.abs(averageDifference) < 100) {
				return "稳定";
			} else if (averageDifference > 0) {
				return "上升";
			} else {
				return "下降";
			}
		}

		function analyzeProfitStability(monthData) {
			var profitDifferences = [];
			var months = Object.keys(monthData);
			for (var i = 1; i < months.length; i++) {
				var prevMonthProfit = monthData[months[i - 1]].profit;
				var currentMonthProfit = monthData[months[i]].profit;
				var difference = currentMonthProfit - prevMonthProfit;
				profitDifferences.push(difference);
			}
			var averageDifference = profitDifferences.reduce(function (a, b) {
				return a + b;
			}, 0) / profitDifferences.length;
			var profitVariance = profitDifferences.reduce(function (a, b) {
				var diff = b - averageDifference;
				return a + diff * diff;
			}, 0) / profitDifferences.length;
			if (Math.abs(averageDifference) < 50 && profitVariance < 1000) {
				return "高";
			} else if (Math.abs(averageDifference) < 100 && profitVariance < 2000) {
				return "中";
			} else {
				return "低";
			}
		}
	</script>
</head>

<body>
<div style="height: 100px; padding: 10px; border: 0px;">
	<fieldset style="border-color: #E7F0FF">
		<legend>统计设置</legend>
		<div style="padding: 5px">
			统计月份：<input id="s_begin" type="text" class="easyui-datebox" required="required" data-options="formatter:myformatter,parser:myparser" editable="false" style="width: 100px">
			&nbsp;&nbsp;-&nbsp;&nbsp;
			<input id="s_end" class="easyui-datebox" data-options="formatter:myformatter,parser:myparser" editable="false" style="width: 100px">
			&nbsp;&nbsp;<a href="javascript:search($('#s_begin').datebox('getValue'), $('#s_end').datebox('getValue'))" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
			&nbsp;&nbsp;<a href="javascript:analyzeMonthlyData($('#s_begin').datebox('getValue'), $('#s_end').datebox('getValue'))" class="easyui-linkbutton" plain="true">📍 分析和意见</a>
		</div>
	</fieldset>
</div>

<div style="padding-left: 10px; padding-right: 10px; border: 0px; height: 350px;">
	<div id="container"></div>
</div>

<div style="padding: 10px; border: 0px; height: 385px">
	<table id="dg" class="easyui-datagrid" fit="true" fitColumns="true" rownumbers="true" singleSelect="true">
		<thead>
		<tr>
			<th field="date" width="30" align="center">统计月份</th>
			<th field="amountSale" width="150" align="right" formatter="formatMoney">销售金额</th>
			<th field="amountCost" width="50" align="right" formatter="formatMoney">成本金额</th>
			<th field="amountProfit" width="50" align="right" formatter="formatMoney">盈利金额</th>
		</tr>
		</thead>
	</table>
</div>

</body>